
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:components="http://java.sun.com/jsf/composite/components"
      xmlns:p="http://primefaces.org/ui"
      >
    <h:head>
        <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
        <!--script src="https://code.jquery.com/jquery.js"></script-->
        <!-- Include all compiled plugins (below), or include individual files as needed -->
        <h:outputScript library="js" name="bootstrap.min.js" />
        <h1 align="center">
            <h:outputText value="Domótica - ML SQ" class="label label-primary" />
        </h1>
    </h:head>

    <h:body>
        <components:navbar />
        <h:form id="vigener">
            <p:panel header="Data">  
                <h:panelGrid id="panel" columns="1" border="0" cellpadding="5" cellspacing="5">
                    <h:inputTextarea value="#{cryptoBean.encryptedText}" cols="100" rows="10" />
                    <h:commandButton value="Submit" action="calculateFrequency" />
                </h:panelGrid>
            </p:panel>
            <p:panel header="Frequency Analyses">  
                <p:chart type="bar" id="category" model="#{cryptoBean.barModel}"/>
            </p:panel>
        </h:form>
    </h:body>

</html>